<template>
    <div class>
        <ul class="quo-w">
            <li>
                <span class="tab-tit">采购订单阶段</span>
                <TabItem :listData="listData1" />
            </li>
            <li>
                <span class="tab-tit">物资生产阶段</span>
                <TabItem :listData="listData2" />
            </li>
            <li>
                <span class="tab-tit">物资配送阶段</span>
                <TabItem :listData="listData3" />
            </li>
            <li>
                <span class="tab-tit">工程投运验收阶段</span>
                <TabItem :listData="listData4" />
            </li>
            <li class="border-no">
                <span class="tab-tit">工程质保阶段</span>
                <TabItem :listData="listData5" />
            </li>
        </ul>
    </div>
</template>
<script>
import SyBottom from './sybottom.vue'
import TabItem from './ItemTab.vue'
export default {
    components: {
        SyBottom,
        TabItem,
    },
    data() {
        return {
            listData1: [
                {
                    date: '95484632',
                    name: '北京ABB高压开关设备有限公司',
                    address: '4.6',
                },
                {
                    date: '548200155',
                    name: '国电博纳(北京)电力设备有限公司',
                    address: '6.0',
                },
                {
                    date: '965752222',
                    name: '河南平高电气股份有限公司',
                    address: '3.6',
                },
                {
                    date: '548200155',
                    name: '河南平高通用电气有限公司',
                    address: '2.9',
                },
                {
                    date: '157895452',
                    name: '河南平芝高压开关有限公司',
                    address: '3.6',
                },
                {
                    date: '25847852',
                    name: '湖南长高电气有限公司',
                    address: '3.2',
                },
                {
                    date: '23578523',
                    name: '江苏省如高高压电器有限公司',
                    address: '9.5',
                },

                {
                    date: '548200155',
                    name: '库柏(宁波)电气有限公司',
                    address: '2.2',
                },
            ],
            listData2: [
                {
                    date: '95484632',
                    name: '平高集团有限公司',
                    address: '6.6',
                },
                {
                    date: '548200155',
                    name: '山东泰开电力开关有限公司',
                    address: '2.3',
                },
                {
                    date: '157895452',
                    name: '山东泰开高压开关有限公司',
                    address: '3.9',
                },
                {
                    date: '25847852',
                    name: '上海思源高压开关有限公司',
                    address: '3.4',
                },
                {
                    date: '23578523',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '9.5',
                },

                {
                    date: '965752222',
                    name: '石家庄科林电气设备有限公司',
                    address: '3.6',
                },
                {
                    date: '548200155',
                    name: '泰安泰山高压开关有限公司',
                    address: '6.0',
                },
                {
                    date: '548200155',
                    name: '特变电工中发上海高压开关有限公司',
                    address: '4.3',
                },
            ],
            listData3: [
                {
                    date: '157895452',
                    name: '西安西电高压开关有限责任公司',
                    address: '3.2',
                },
                {
                    date: '548200155',
                    name: '西安西电开关电气有限公司',
                    address: '2.6',
                },
                {
                    date: '965752222',
                    name: '西门子(杭州)高压开关有限公司',
                    address: '4.1',
                },
                {
                    date: '25847852',
                    name: '新东北电气集团高压开关有限公司',
                    address: '3.3',
                },
                {
                    date: '23578523',
                    name: '浙江紫光电器有限公司',
                    address: '9.5',
                },
                {
                    date: '95484632',
                    name: '正泰电气股份有限公司',
                    address: '6.6',
                },
                {
                    date: '548200155',
                    name: '山东泰开高压开关有限公司',
                    address: '4.0',
                },
                {
                    date: '548200155',
                    name: '新东北电气集团高压开关有限公司',
                    address: '5.1',
                },
            ],
            listData4: [
                {
                    date: '548200155',
                    name: '山东泰开电力开关有限公司',
                    address: '2.2',
                },
                {
                    date: '157895452',
                    name: '山东泰开高压开关有限公司',
                    address: '3.6',
                },
                {
                    date: '25847852',
                    name: '上海思源高压开关有限公司',
                    address: '3.3',
                },
                {
                    date: '23578523',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '9.5',
                },
                {
                    date: '548200155',
                    name: '山东泰开高压开关有限公司',
                    address: '2.4',
                },
                {
                    date: '548200155',
                    name: '浙江紫光电器有限公司',
                    address: '2.3',
                },
                {
                    date: '965752222',
                    name: '新东北电气集团高压开关有限公司',
                    address: '3.6',
                },
                {
                    date: '548200155',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '2.9',
                },
                {
                    date: '548200155',
                    name: '山东泰开高压开关有限公司',
                    address: '2.85',
                },
            ],
            listData5: [
                {
                    date: '157895452',
                    name: '山东泰开高压开关有限公司',
                    address: '3.3',
                },
                {
                    date: '25847852',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '3.5',
                },
                {
                    date: '23578523',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '9.5',
                },
                {
                    date: '548200155',
                    name: '山东泰开电力开关有限公司',
                    address: '2.9',
                },
                {
                    date: '157895452',
                    name: '山东泰开高压开关有限公司',
                    address: '3.6',
                },
                {
                    date: '25847852',
                    name: '上海思源高压开关有限公司',
                    address: '3.7',
                },
                {
                    date: '23578523',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '9.5',
                },
                {
                    date: '548200155',
                    name: '施耐德(陕西)宝光电器有限公司',
                    address: '3.7',
                },
                {
                    date: '548200155',
                    name: '新东北电气集团高压开关有限公司',
                    address: '4.8',
                },
            ],
            info: [
                '订单编号：4100518510',
                '供应商名称: 浙江紫光电器有限公司',
                '基准建议价格: 8.5%',
                '当前阶段: 工程质保',
                '实时建议利率: 5.5%',
                '实时跟踪利率: 5.5%',
                '风险值评价: 30分',
            ],
        }
    },
    mounted() {},
    methods: {},
}
</script>
<style lang="scss">
.quo-w {
    margin-right: 2px;
    margin-top: 60px;
    li {
        width: 275px;
        float: left;
        border-right: 1px dotted #ebeef5;
        &.border-no {
            border-right: none !important;
        }
    }

    .tab-tit {
        font-size: 12px;
        color: #00796a;
        font-weight: bold;
        text-align: center;
        display: block;
    }
    .tab-info {
        width: 400px;
        min-height: 300px;
        float: left;
        margin-top: -1px;
        margin-left: 20px;
        .li-one {
            height: 35px !important;
            line-height: 35px;
            font-size: 12px;
            color: red;
        }
    }
}
</style>